.diff-view {
  Line {
    -fx-stroke: -df-background-lighter;

    &.insert {
      -fx-stroke: -df-defold-green-dark;
    }

    &.delete {
      -fx-stroke: -df-defold-red-dark;
    }
  }

  Text {
    -fx-fill: -df-text;
    
    &.insert {
      -fx-fill: -df-text-light;
    }

    &.delete {
      -fx-fill: -df-text-light;
    }
  }

  #markers {
    -fx-min-width: 40px;
    -fx-max-width: 40px;
    -fx-pref-width: 40px;
    -fx-background-color: -df-background;
  }

  .code-view {
    -fx-pref-width: 300px;
    -fx-background-color: -df-background-light;
  }

  .code-view-header {
    -fx-text-fill: -df-text-dark;
    -fx-min-height: 40px;
    -fx-alignment: center;
  }

  .diff-box {
    -fx-fill: -df-background-lighter;
    -fx-stroke: -df-background-lighter;

    &.insert {
      -fx-fill: -df-defold-green-dark;
      -fx-stroke: -df-defold-green-dark;
    }

    &.delete {
      -fx-fill: -df-defold-red-dark;
      -fx-stroke: -df-defold-red-dark;
    }
  }
}
